<template>
  <div>
    <el-form
      :model="ruleForm"
      :rules="rules"
      ref="ruleForm"
      label-width="100px"
      class="demo-ruleForm"
    >
      <el-form-item label="地区" prop="region">
        <el-cascader
          v-model="ruleForm.region"
          :options="ruleForm.regionOptions"
          :props="{ expandTrigger: 'hover',value: 'label' }"
          filterable
          style="width: 500px;"
        ></el-cascader>
      </el-form-item>
      <el-form-item label="确诊">
        <el-input-number
          v-model="ruleForm.confirmed"
          :min="0"
          :max="10000000000"
          label="确诊"
        ></el-input-number>
      </el-form-item>
      <el-form-item label="疑似">
        <el-input-number
          v-model="ruleForm.suspected"
          :min="0"
          :max="10000000000"
          label="疑似"
        ></el-input-number>
      </el-form-item>
      <el-form-item label="死亡">
        <el-input-number
          v-model="ruleForm.dead"
          :min="0"
          :max="10000000000"
          label="死亡"
        ></el-input-number>
      </el-form-item>
      <el-form-item label="治愈">
        <el-input-number
          v-model="ruleForm.cure"
          :min="0"
          :max="10000000000"
          label="治愈"
        ></el-input-number>
      </el-form-item>
      <el-form-item label="重症">
        <el-input-number
          v-model="ruleForm.severe"
          :min="0"
          :max="10000000000"
          label="重症"
        ></el-input-number>
      </el-form-item>
      <el-form-item label="境外输入">
        <el-input-number
          v-model="ruleForm.outside"
          :min="0"
          :max="10000000000"
          label="境外输入"
        ></el-input-number>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="submitForm('ruleForm')"
          >提交</el-button
        >
        <el-button @click="resetForm('ruleForm')">重置</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import {regionData,CodeToText} from "element-china-area-data";
import { post } from "@/utils/request";
export default {
data() {
  return {
    ruleForm: {
      region: [],
      regionOptions: [{value:"中国",label:"中国",children:regionData}],
      confirmed: 0,
      suspected: 0,
      dead: 0,
      cure: 0,
      severe: 0,
      outside: 0,
    },
    rules: {
      region: [
        {
          type: "array",
          required: true,
          message: "请选择类别",
          trigger: "blur",
        },
      ],
    },
  };
},
created(){
  console.log(this.ruleForm.regionOptions);
},
methods: {
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          let data = {
            country:this.ruleForm.region[0],
            province:this.ruleForm.region[1],
            city:this.ruleForm.region[2],
            area:this.ruleForm.region[3],
            confirmed:this.ruleForm.confirmed,
            suspected:this.ruleForm.suspected,
            dead:this.ruleForm.dead,
            cure:this.ruleForm.cure,
            severe:this.ruleForm.severe,
            outside:this.ruleForm.outside
          }
          console.log("rulefome",this.ruleForm)
          post('/epidemic/saveOrUpdate',data).then(res=>{
            console.log('提交',res);
              this.$notify({
                title: '你真棒！',
                message: '提交成功'
              });

          })
         
        } else {
          console.log('error submit!!');
          return false;
        }
      });
        this.ruleForm.region = [];
        this.ruleForm.confirmed = 0;
        this.ruleForm.suspected=0;
        this.ruleForm.cure=0;
        this.ruleForm.dead=0;
        this.ruleForm.outside=0;
        this.ruleForm.severe=0;
    },
    resetForm(formName) {
      this.$refs[formName].resetFields();
      this.ruleForm.confirmed = 0;
      this.ruleForm.suspected=0;
      this.ruleForm.cure=0;
      this.ruleForm.dead=0;
      this.ruleForm.outside=0;
      this.ruleForm.severe=0;
    }
  }
}
function getCookie(name) {
  let matches = document.cookie.match(new RegExp(
    "(?:^|; )" + name.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, '\\$1') + "=([^;]*)"
  ));
  return matches ? decodeURIComponent(matches[1]) : undefined;
}
</script>

<style scoped>
</style>
